/**
 * Created by DuHuiling on 2017/4/25.
 */
var Tooltip = require('../../../../src/libs/tooltip');

var Agreement = React.createClass({
    getDefaultProps:function () {
        return{
            url:PageDM.URL.value
        }
    },
    getInitialState:function () {
        return{
            url:this.props.url
        }
    },
    render:function () {
        return <a href={this.state.url.agreement.link} className="agreement" target="_blank"><i className="iconfont icon-protocol11"></i>《{this.state.url.agreement.name}》</a>
    }
});

var InvestDetail = React.createClass({
    getInitialState:function(){
        return{
            ProDetail:this.props.ProDetail
        }
    },
    //导出PDF文件
    exportPDF:function(){
        //console.log(this.refs.getRealDom);
        this.props.exportPDF.onClick(this.refs.getRealDom.outerHTML);
    },
    setMessage:function(orderStatus,isRefund){
        var msg = {};
        switch (orderStatus){
            case 6:
                msg = {
                    statusText: "处理中"
                };
                break;
            case 70:
                msg = {
                    statusText: "支付失败",
                    tips:"对不起，该订单交易处理失败，请您稍后再试或者咨询：95039"
                };
                break;
            case 60:
                msg = {
                    statusText: "项目流标",
                    status:"",//项目状态
                    money:{//金额
                        key:"流标金额",
                        value:0
                    },
                    time:{//时间
                        key:"投资时间",
                        value:""
                    },
                    tips:""
                };
                if(isRefund){
                    msg.status = "项目流标，已退款";
                    msg.tips = "您的流标资金已退至您投标时绑定的回款账户，请注意查收。如超期未收到退款，请及时联系平台客服。";
                }else{
                    msg.status = "项目流标，未退款";
                    msg.tips = "由于您投资的项目未能成立，您的投标资金已进行退款处理，相关资金最快将在本项目投标结束日后3个工作日内（如遇节假日将顺延）退至您投标时绑定的回款账户，请注意查收。如超期未收到退款，请及时联系银行客服。";
                }
                break;
            case 10:
                msg = {
                    statusText: "项目超募",
                    status:"",//项目状态
                    money:{//金额
                        key:"超募金额",
                        value:0
                    },
                    time:{//时间
                        key:"超募时间",
                        value:""
                    },
                    tips:""
                };
                if(isRefund){
                    msg.status = "项目超募，已退款";
                    msg.tips = "您的超募资金已退至您投标时绑定的回款账户，请注意查收。如超期未收到退款，请及时联系平台客服。";
                }else{
                    msg.status = "项目超募，待退款";
                    msg.tips = "由于您投资的项目已超募，您的投标资金已进行退款处理，相关资金最快将在本项目投标结束日后3个工作日内（如遇节假日将顺延）退至您投标时绑定的回款账户，请注意查收。如超期未收到退款，请及时联系银行客服。";
                }
                break;
            case 20:
                msg = {
                    statusText: "回收完成",
                    status:"已回款",//项目状态
                    money:{//金额
                        key:"回款本金",
                        value:0
                    },
                    earnings:{
                        key:"回款收益",
                        value:0
                    },
                    time:{//时间
                        key:"回款时间",
                        value:""
                    },
                    tips:"您本次投标的本金和收益已支付至您投标时绑定的回款账户并将于1-3个工作日内到账，请注意查收。如超期未收到款项，请及时联系平台客服。"
                };
                break;
            case 30:
                msg = {
                    statusText: "回款中",
                    status:"回款中",//项目状态
                    money:{//金额
                        key:"回款本金",
                        value:0
                    },
                    earnings:{
                        key:"回款收益",
                        value:0
                    },
                    time:{//时间
                        key:"原定回款日",
                        value:""
                    },
                    tips:"您本次投标的本金和收益正在回款中，请耐心等候。"
                };
                break;
            case 40:
                msg.statusText = "计息中";break;
            case 50:
                msg.statusText = "已投标待起息";break;
        }
        return msg;
    },
    getRefs:function (ref) {
        return this.refs[ref];
    },
    render:function(){
        var _this = this;
        var ProDetail = _this.state.ProDetail,
            orderStatus = ProDetail.UserCenterOrderStatus;
        var ProjectMessage = this.setMessage(orderStatus,ProDetail.IsRefund);
        //数字格式化
        var IncomeAmount = UFormatter.formatMoney(Number(ProDetail.IncomeAmount),2),//预期收益
            PayAmount = UFormatter.formatMoney(Number(ProDetail.PayAmount),2),//投资本金
            ProjectAmount = Number(ProDetail.ProjectAmount);//项目规模
        if(ProjectAmount < 10000){
            ProjectAmount = UFormatter.formatMoney(ProjectAmount,2) + "元";
        }else{
            ProjectAmount = UFormatter.formatMoney(ProjectAmount/10000,2) + "万元";
        }

        return(
            <div className="invest-detail">
                <div className="title-account"><span>投资详情</span>
                    <div className="other">
                        <a href="javascript:void (0)" onClick={this.exportPDF.bind(this)}><i className="iconfont icon-export"></i><p>导出PDF文件</p></a>
                        <a href="javascript:void (0)" onClick={this.props.printBtn.onClick}><i className="iconfont icon-print"></i><p>打印</p></a>
                        <a href={this.props.url.value.goBack}><i className="iconfont icon-back"></i><p>返回</p></a>
                    </div>
                </div>
                <div ref="getRealDom">
                    <h1>
                        {ProDetail.ProjectName}
                        {ProDetail.ProjectType ?
                            ProDetail.IsExclusivePublic ?
                            <Tooltip title="专属项目，需输入项目专属识别码才可投标" className="bg-icon iconfont icon-zhuang tooltip"></Tooltip> :
                            <span className="bg-icon tag tag-zhuang"></span> : ""
                        }
                        {ProDetail.UserCenterOrderStatus ?
                            <span className={"tag " + "tag-red"}>{ProjectMessage.statusText}</span> : ""
                        }
                    </h1>

                    {(orderStatus == 10 || orderStatus == 20 || orderStatus == 30 || orderStatus == 60) ?
                        <div className="failure-tips">
                            <p>
                                项目状态：<span className="fc-main">{ProjectMessage.status}</span><em></em>
                                {ProjectMessage.money.key}：<span className="fc-main">{PayAmount}</span>元<em></em>
                                {ProjectMessage.earnings ?
                                    <span>{ProjectMessage.earnings.key}:<span className="fc-main">{IncomeAmount}</span>元<em></em></span>:""
                                }{/*预期收益=投资总额*年化利率*项目期限/365，保留小数后两位，单位元*/}
                                {ProjectMessage.time.key}：
                                    <span className="fc-main">
                                        {orderStatus == 10 || orderStatus == 60 ?
                                            ProDetail.PayTime:
                                            ProDetail.RepayBegin
                                        }
                                    </span>
                            </p>
                            <p className="fc-light">{ProjectMessage.tips}</p>
                        </div> :
                    orderStatus == 70 ?
                        <div className="failure-tips">
                            <p className="fc-light">{ProjectMessage.tips}</p>
                        </div> : ""
                    }

                    {(orderStatus == 6 || orderStatus == 50 || orderStatus == 40) ?
                        <div className="money">
                            <ul className="clearfix">
                                <li><p className="fc-main"><b className="fs42">{IncomeAmount}</b>元</p>
                                    <p className="fc-light">预期收益</p></li>
                                <li><p><b>{PayAmount}</b>元</p>
                                    <p className="fc-light">投资本金</p></li>
                            </ul>
                        </div> : ""
                    }

                    <div className="info">
                        <ul className="clearfix">
                            <li><p>{ProDetail.Duration + "天"}</p>
                                <p className="fc-light">投资期限</p></li>
                            <li><p className="fc-main"><b>{ProDetail.InvestmentInterest}</b>%</p>
                                <p className="fc-light">年化利率</p></li>
                            <li><p>{ProjectAmount}</p>
                                <p className="fc-light">项目规模</p></li>
                        </ul>
                    </div>
                    <div className="pro-data">
                        <ul className="clearfix">
                            <li>项目起息日：{ProDetail.ValueBegin}</li>
                            <li>项目到期日：{ProDetail.RepayBegin}</li>
                            <li>还款方式：到期一次性还本付息</li>
                        </ul>
                    </div>
                    <div className="bank-back clearfix">
                        <label className="f-left">回款账户：</label>
                        <div className="input f-left">
                            <span className={"bank-logo "+ProDetail.CallbackAccount.BankLogo}></span>
                            <span>{ProDetail.CallbackAccount.AccountNo}</span>
                        </div>
                        {(orderStatus == 40 || orderStatus == 30 || orderStatus == 20) ?
                            <Agreement ref="agreement"/> : ''
                        }
                    </div>
                </div>
                <span className="angle angle-right-bottom"></span>
            </div>
        )
    }
});
module.exports = InvestDetail;